<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/style.css" />
		<style>
			.mui-input-row label {
				font-family: 'Helvetica Neue', Helvetica, sans-serif;
				line-height: 1.1;
				float: left;
				width: 35%;
				padding: 11px 5px;
				font-size: 14px;
				color: #666;
			}
			
			.mui-btn {
				border: 1px solid #25CDDA;
				width: 300px;
				background-color: #25CDDA;
			}
			
			.mui-btn:active {
				border: 1px solid #58dde8!important;
				background-color: #58dde8!important;
			}
			
			.mui-bar-nav {
				background: #27CDDB;
			}
			
			.mui-action-back,
			.mui-title,
			.mui-action-back:active {
				color: #FFFFFF;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title" id="title">实名认证</h1>
		</header>
		<div class="mui-content">
			<p style="margin: 10px;">
				**请务必填写本人真实信息，随意填写信息或盗用他人信息，一经发现直接封号。
			</p>
			<div class="mui-input-row" style="background: white;margin-top: 5px;margin-left: 5px;margin-right: 5px;">
				<label>姓名：</label>
				<input id="nameInput" type="text" class="mui-input-clear" placeholder="请输入真实姓名" maxlength="10">
			</div>

			<div class="mui-input-row" style="background: white;margin-top: 5px;margin-left: 5px;margin-right: 5px;">
				<label>身份证：</label>
				<input id="cardNumInput" type="text" class="mui-input-clear" placeholder="请输入身份证号码" maxlength="18">
			</div>
			
			<div class="mui-input-row" style="background: white;margin: 5px;">
				<div style="text-align: center;width: 48%;float: left;" id="upload_zm">
					<div id="zm" class="mui-card-header mui-card-media" style="height:60vw;background:#B6B6B6;background-repeat: no-repeat;background-size: 100% 100%;"><span>身份证正面</span></div>
				</div>
	
				<div style="text-align: center;width: 48%;float:right" id="upload_fm">
					<div id="fm" class="mui-card-header mui-card-media" style="height:60vw;background:#B6B6B6;background-repeat: no-repeat;background-size: 100% 100%;"><span>身份证反面</span></div>
				</div>
			</div>

			<div class="mui-button-row" style="margin-bottom: 20px;margin-top: 10px;">
				<button type="button" class="mui-btn mui-btn-primary" id="confirm">确认提交</button>&nbsp;&nbsp;
			</div>
		</div>

		<script src="../js/mui.min.js "></script>
		<script type="text/javascript" src="../js/public.js"></script>
		<script type="text/javascript" src="../js/jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="../js/idcard.js" ></script>
		<script type="text/javascript ">
			mui.init()
			var tooken = "";
			var member = null;
			mui.plusReady(function() {
				swipeBack();
				tooken = getTooken();
				member = JSON.parse(plus.storage.getItem("member"));
			})

			document.getElementById('confirm').addEventListener('tap', function() {
				var nameInput = document.getElementById('nameInput');
				var cardNumInput = document.getElementById('cardNumInput');

				var name = nameInput.value;
				var cardNum = cardNumInput.value;

				//验证密码
				if(!name) {
					mymui("请输入真实姓名");
					return;
				}
				if(!cardNum) {
					mymui("请输入身份证号码");
					return;
				}
				if(!_$id.checkCardNumber(cardNum)) {
					mymui("身份证号码有误");
					return;
				}
				commitNameCard(name, cardNum);
			});

			//提交姓名，身份信息
			function commitNameCard(name, card) {
				mui.ajax({
					url: UploadNameCard,
					type: 'POST',
					data: {
						"realname": name,
						"idNumber": card
					},
					dataType: "json",
					headers: {
						"token": tooken,
						'Content-Type': 'application/json',
						'charset': 'utf-8'
					},
					success: function(data) {
						mConsole.log("实名认证:" + JSON.stringify(data));
						var code = data.code;
						if(code == 0) {
							// 显示自动消失的提示消息
							plus.nativeUI.toast("身份信息提交成功");
							member.authStatus = "1";
							plus.storage.setItem("member", JSON.stringify(member));
							//							plus.storage.setItem("auth_status", "3");
							openSetting();
						} else {
							mymui(data.msg);
						}
					},
					error: function(xhr, type, errorThrown) {
						mymui("网络异常：" + type);
					}
				});
			}

			//上传图片相关代码
			var f1 = null;
			var picarr = new Array();
			var basearr = new Array();
			var lat = "",
				longt = "";
			var file = null;
			// 上传文件  
			function upload(url) {
				var wt = plus.nativeUI.showWaiting("上传中，请稍后...");
				var task = plus.uploader.createUpload(url, {
					method: "POST",
					blocksize: 1024000
				}, function(t, status) {
					if(status == 200) {
						var result = t.responseText;
						var parseResult = JSON.parse(result);
						mConsole.log(result);
						//上传完成        
						if(parseResult.code == "0") {
							mConsole.log("上传成功：" + t.responseText);
							mymui("上传成功");
						} else {
							mymui(parseResult.msg);
						}
						files = null; //清空数组
						wt.close();
					}
				});
				task.setRequestHeader("token", tooken);
				task.setRequestHeader("charset", "utf-8");
				task.addFile(file.path, {
					key: file.name
				});
				task.start();
			}

			function galleryImgs(imageTap) { // i为1上传正面，否则为反面 
				plus.gallery.pick(function(e) {
						mConsole.log(e);
						if(imageTap == 1) {
							$("#zm").css("background-image", "url(" + e + ")");
						} else {
							$("#fm").css("background-image", "url(" + e + ")");
						}
						file = {
							name: "file", //这个值服务器会用到，作为file的key      
							path: e
						}
						if(imageTap == 1) {
							upload(UploadSfZm);
						} else {
							upload(UploadSfFm);
						}
					},
					function(e) {
						mConsole.log("取消选择图片");
					}, {
						filter: "image"
					});
			}

			function showActionSheet(imageTap) {
				var bts = [{
					title: "拍照"
				}, {
					title: "从相册选择"
				}];
				plus.nativeUI.actionSheet({
					cancel: "取消",
					buttons: bts
				}, function(e) {
					if(e.index == 1) {
						getImage(imageTap);
					} else if(e.index == 2) {
						galleryImgs(imageTap);
					}
				});
			}

			//拍照  
			function getImage(imageTap) {
				var cmr = plus.camera.getCamera();
				cmr.captureImage(function(p) {
					plus.io.resolveLocalFileSystemURL(p, function(entry) {
						var localurl = entry.toLocalURL(); //        
						if(imageTap == 1) {
							$("#zm").css("background-image", "url(" + localurl + ")");
						} else {
							$("#fm").css("background-image", "url(" + localurl + ")");
						}
						file = {
							name: "file", //这个值服务器会用到，作为file的key      
							path: localurl
						}
						if(imageTap == 1) {
							upload(UploadSfZm);
						} else {
							upload(UploadSfFm);
						}
					});
				});
			}

			document.getElementById("upload_zm").addEventListener("tap", function() {
				showActionSheet(1); //拍照还是相册  ,身份证正面
			});

			document.getElementById("upload_fm").addEventListener("tap", function() {
				showActionSheet(2); //拍照还是相册   身份证反面
			});

			///////////////////////////////////////////////////////////

			function openSetting() {
				//触发详情页面的setUserState事件
				mui.fire(plus.webview.getWebviewById('setting'), 'setUserState', {});
				//打开
				mui.back();
			}
		</script>
	</body>

</html>